<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%-- jsp的动态包含和静态包含,参照Servlet知识点 --%>
<%@ include file="/common/include/page.jsp"%>
<!doctype html>
<html class="no-js" lang="en">

<head>
    <title>下单列表 - 商城</title>
    <%@ include file="/common/include/title.jsp" %>
</head>
<body>
    <%@ include file="/common/include/header.jsp" %>
    <div class="breadcrumbs_area">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="breadcrumb_content">
                        <ul>
                            <li>
                                <h1><a href="index.html">首页</a></h1>
                            </li>
                            <li>下单</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="checkout-area mt-50">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="user-actions">
                        <h5>
                            <i class="fa fa-file-o"></i>
                            Returning customer?
                            <a href="#" data-toggle="collapse" data-target="#checkout-login">Click here to login</a>
                        </h5>
                        <div id="checkout-login" class="collapse">
                            <div class="checkout_info">
                                <p>If you have shopped with us before, please enter your details in the boxes below. If you are a new customer please proceed to the Billing &amp; Shipping section.</p>
                                <form class="form-row" action="#">
                                    <div class="form_group col-12 col-md-6">
                                        <label class="form-label">Username or email <span>*</span></label>
                                        <input class="input-form" type="text">
                                    </div>
                                    <div class="form_group col-12 col-md-6">
                                        <label class="form-label">Password <span>*</span></label>
                                        <input class="input-form" type="text">
                                    </div>
                                    <div class="form_group group_3 col-lg-1">
                                        <button class="login-register" type="submit">Login</button>
                                    </div>
                                    <div class="form_group group_3 col-lg-9">
                                        <label for="remember_box">
                                            <input id="remember_box" type="checkbox">
                                            <span> Remember me </span>
                                        </label>
                                    </div>
                                    <div class="col-lg-12 text-left">
                                        <a class="lost-password" href="#">Lost your password?</a>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="user-actions">
                        <h5>
                            <i class="fa fa-file-o" aria-hidden="true"></i>
                            Returning customer?
                            <a href="#" data-toggle="collapse" data-target="#checkout_coupon">Click here to enter your code</a>
                        </h5>
                        <div id="checkout_coupon" class="collapse">
                            <div class="coupon-code">
                                <div class="coupon-inner">
                                    <input placeholder="Coupon code" type="text">
                                    <button type="submit">Apply coupon</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <form class="form-row" action="${rootPath}/head/orders/ordersInsertSubmit.mvc" method="post">
                    <div class="col-lg-6 col-md-6">
                        <div class="col-lg-12">
                            <h5 class="form-head">订单信息</h5>
                        </div>
                        <div class="form_group col-12">
                            <label class="form-label">收货人姓名:<span>*</span></label>
                            <input class="input-form" type="text" name="receName">
                        </div>
                        <div class="form_group col-12">
                            <label class="form-label">收货人手机号:<span>*</span></label>
                            <input class="input-form" type="text" name="receAddress">
                        </div>
                        <div class="form_group col-12">
                            <label class="form-label">收货人地址:<span>*</span></label>
                            <input class="input-form" type="text" name="recePhone">
                        </div>
                        <div class="form-row mt-20 mb-15">
                            <div class="form_group mb-0 col-12">
                                <label class="form-label" for="order-note">备注 <span>*</span></label>
                                <textarea class="form-textarea" id="order-note" placeholder="请输入备注" name="content"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6">
                    <div class="col-lg-12">
                        <h5 class="form-head rs-padding">商品明细</h5>
                    </div>
                    <div class="col-lg-12">
                        <div class="order_table table-responsive">
                            <table>
                                <thead>
                                    <tr>
                                        <th>商品</th>
                                        <th>总价格</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <c:forEach items="${requestScope.list}" var="listTemp" varStatus="stat">
                                        <tr>
                                            <td> ${listTemp.goods.name} <strong> × ${listTemp.num}</strong></td>
                                            <td> ${listTemp.goods.price * listTemp.num}</td>
                                        </tr>
                                    </c:forEach>
                                </tbody>
                                <tfoot>
                                <tr>
                                    <th>Cart Subtotal</th>
                                    <td>$215.00</td>
                                </tr>
                                <tr>
                                    <th>Shipping</th>
                                    <td><strong>$5.00</strong></td>
                                </tr>
                                <tr class="order_total">
                                    <th>Order Total</th>
                                    <td><strong>$220.00</strong></td>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-12">
                            <div class="form-check">
                                <div class="custom-checkbox" data-toggle="collapse" data-target="#checkout-check-2" role="checkbox" aria-checked="false">
                                    <input class="form-check-input" type="checkbox" id="create_account-2">
                                    <span class="checkmark"></span>
                                    <label class="form-check-label" for="create_account-2">Create an account</label>
                                </div>
                            </div>
                            <div class="collapse" id="checkout-check-2">
                                <div class="mt-10">
                                    <p>Please send a check to Store Name, Store Street, Store Town, Store State / County, Store Postcode.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-12">
                            <div class="form-check">
                                <div class="custom-checkbox" data-toggle="collapse" data-target="#bank-money" role="checkbox" aria-checked="false">
                                    <input class="form-check-input" type="checkbox" id="bank_check">
                                    <span class="checkmark"></span>
                                    <label class="form-check-label" for="bank_check">Check Payments</label>
                                </div>
                            </div>
                            <div class="collapse" id="bank-money">
                                <div class="mt-10">
                                    <p>Please send a check to Store Name, Store Street, Store Town, Store State / County, Store Postcode. </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-12">
                            <div class="form-check">
                                <div class="custom-checkbox" data-toggle="collapse" data-target="#cash-money" role="checkbox" aria-checked="false">
                                    <input class="form-check-input" type="checkbox" id="bank_cash">
                                    <span class="checkmark"></span>
                                    <label class="form-check-label" for="bank_cash">Cash on Delivery</label>
                                </div>
                            </div>
                            <div class="collapse" id="cash-money">
                                <div class="mt-10">
                                    <p>Pay with cash upon delivery. </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-12">
                            <div class="form-check">
                                <div class="custom-checkbox" data-toggle="collapse" data-target="#bank-check" role="checkbox" aria-checked="false">
                                    <input class="form-check-input" type="checkbox" id="bank_account">
                                    <span class="checkmark"></span>
                                    <label class="form-check-label" for="bank_account">PayPal Express Checkout</label>
                                </div>
                            </div>
                            <div class="collapse" id="bank-check">
                                <div class="mt-10">
                                    <p>Pay via PayPal; you can pay with your credit card if you don’t have a PayPal account. </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-12">
                            <div class="form-check">
                                <div class="custom-checkbox">
                                    <input class="form-check-input" type="checkbox" id="agree-condition">
                                    <span class="checkmark"></span>
                                    <label class="form-check-label" for="agree-condition">I agree to the <a href="#">terms of service</a> and will adhere to them unconditionally.</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row justify-content-end mt-20 mb-20">
                        <input type="submit" class="btn-secondary" value="提交订单">
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>
    <%@ include file="/common/include/footer.jsp"%>
</body>
</html>